<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>这是个关于VUE 的界面 (vue3)</title>
</head>
<body>
	<div id="app">{{ message }}</div>
	

	<hr>

	<button>测试</button>
</body>
<!-- <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
  const { createApp, ref } = Vue

  createApp({
    setup() {
      const message = ref('Hello vue!')
      return {
        message
      }
    }
  }).mount('#app')
</script> -->
<!-- 
<script type="module">
  import { createApp, ref } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'

  createApp({
    setup() {
      const message = ref('Hello Vue!')
      return {
        message
      }
    }
  }).mount('#app')
</script>
-->

<script type="importmap">
  {
    "imports": {
      "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
    }
  }
</script>

<!-- 
<script type="module">
  import { createApp, ref } from 'vue'

  createApp({
    setup() {
      const message = ref('Hello Vue!')
      return {
        message
      }
    }
  }).mount('#app')
</script>
-->

<script type="module">
  import { createApp } from 'vue'
  import MyComponent from '../js/my-component.js'

  createApp(MyComponent).mount('#app')
</script>
</html>